<template>
	<view class="container">
		<v-tabs v-model="current" :tabs="category" @change="changeTab" class="tab"></v-tabs>
		<view class="coupon" ref="coupon">
			<view class="item" v-for="(v, i) in projectList" @click="toProject(i)" :key="i">
				<view class="top">
					<view class="left">
						<view class="content">
							<image :src="v.logo" class="icon" mode="widthFix" />
							<view class="name">{{ v.title }}</view>
						</view>
						<view class="text"> {{v.tag ? v.tag : "天天可领"}}</view>
					</view>
					<view class="right">免费领取</view>
				</view>
				<view class="bottom"><image :src="v.image" mode="widthFix" /></view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			current: 0,
			"category": [{
				"icon": "https://img.yourtools.icu/images/category/all.png",
				"text": "全部",
				"tabId": 0
			}, {
				"icon": "https://img.yourtools.icu/images/category/ele.png",
				"text": "饿了么",
				"tabId": 1
			}, {
				"icon": "https://img.yourtools.icu/images/category/meituan.png",
				"text": "美团",
				"tabId": 2
			}, {
				"icon": "https://img.yourtools.icu/images/category/meiweibuyongdeng.jpg",
				"text": "美味不用等",
				"tabId": 3
			}, {
				"icon": "https://img.yourtools.icu/images/category/hf.jpg",
				"text": "话费",
				"tabId": 4
			}, {
				"icon": "https://img.yourtools.icu/images/category/jd.png",
				"text": "京东",
				"tabId": 5
			}, {
				"icon": "https://img.yourtools.icu/images/category/xc.png",
				"text": "携程",
				"tabId": 6
			}, {
				"icon": "https://img.yourtools.icu/images/category/didi.jpg",
				"text": "滴滴出行",
				"tabId": 7
			}, {
				"icon": "https://img.yourtools.icu/images/category/cxyx.png",
				"text": "橙心优选",
				"tabId": 8
			}, {
				"icon": "https://img.yourtools.icu/images/category/hxz.png",
				"text": "花小猪",
				"tabId": 9
			}],
			projectList:[],
			"allProjects": [{
				"title": "美团外卖红包",
				"description": "description",
				"sort": 1,
				"cate_id": 2,
				"logo": "https://img.yourtools.icu/images/projects/meituan.png",
				"image": "https://img.yourtools.icu/images/projects/meituan_banner.jpg",
				"url": "https://runion.meituan.com/url?key=7c2a1b12b058bb28b2ceaf6b22e4b89b&url=https%3A%2F%2Fcube.meituan.com%2Fawp%2Fhfe%2Fblock%2Fa945391288b790d558b7%2F78716%2Findex.html%3Fappkey%3D7c2a1b12b058bb28b2ceaf6b22e4b89b%3Acoupon&sid=coupon",
				"appid": "wxde8ac0a21135c07d",
				"path": "/index/pages/h5/h5?weburl=https%3A%2F%2Frunion.meituan.com%2Furl%3Fkey%3D7c2a1b12b058bb28b2ceaf6b22e4b89b%26url%3Dhttps%253A%252F%252Fcube.meituan.com%252Fawp%252Fhfe%252Fblock%252Fa945391288b790d558b7%252F78716%252Findex.html%253Fappkey%253D7c2a1b12b058bb28b2ceaf6b22e4b89b%253Acoupon%26sid%3Dcoupon"
			}, {
				"title": "饿了么外卖红包",
				"description": "description",
				"sort": 2,
				"cate_id": 1,
				"logo": "https://img.yourtools.icu/images/projects/ele.png",
				"image": "https://img.yourtools.icu/images/projects/eleme_hongbao.jpg",
				"url": "",
				"appid": "wxece3a9a4c82f58c9",
				"path": "taoke/pages/shopping-guide/index?scene=gjhtMtu"
			}, {
				"title": "饿了么天天领红包",
				"tag": "天天领",
				"description": "description",
				"sort": 3,
				"logo": "https://img.yourtools.icu/images/projects/ele.png",
				"image": "https://img.yourtools.icu/images/projects/ele_banner.jpg",
				"url": "https://h5.ele.me/ant/qrcode?open_type=miniapp&url_id=35&inviterId=d9a5ab2",
				"cate_id": 1,
				"appid": "wxece3a9a4c82f58c9",
				"path": "ele-recommend-price/pages/guest/index?inviterId=d9a5ab2"
			}, {
				"title": "美味不用等合伙人",
				"tag": "合伙人",
				"description": "description",
				"sort": 3,
				"logo": "https://img.yourtools.icu/images/category/meiweibuyongdeng.jpg",
				"image": "https://img.yourtools.icu/images/projects/meiweibuyongdeng.jpg",
				"url": "",
				"cate_id": 3,
				"appid": "wx83353b06653df705",
				"path": "zofui_sales/fenxiao/joinPartner?scene=822299&ald_share_src=5bf2abccc7f1087da9c41b5db51db4e0"
			}, {
				"title": "美团酒店折上再减",
				"tag": "折上减",
				"description": "description",
				"sort": 4,
				"cate_id": 2,//
				"logo": "https://img.yourtools.icu/images/projects/meituan.png",
				"image": "https://img.yourtools.icu/images/projects/meituan_jiudian.png",
				"url": "https://act5.meituan.com/clover/page/adunioncps/share_coupon_new?utmSource=64181&utmMedium=DC751FF1558F04BDBD33396C4F74BD69&promotionId=20344&activity=yknUrA9Rrx",
				"appid": "wxde8ac0a21135c07d",
				"path": "/index/pages/h5/h5?weburl=https%3A%2F%2Fact5.meituan.com%2Fclover%2Fpage%2Fadunioncps%2Fshare_coupon_new%3FutmSource%3D64181%26utmMedium%3DDC751FF1558F04BDBD33396C4F74BD69%26promotionId%3D20344%26activity%3DyknUrA9Rrx"
			},{
				"title": "美团外卖特惠红包",
				"tag":"最高15元",
				"description": "description",
				"sort": 5,
				"cate_id": 2,
				"logo": "https://vkceyugu.cdn.bspapp.com/VKCEYUGU-4212d060-22ea-4808-b477-f5c9c9f2d4e2/f49b0ce3-78e7-46e4-aa3a-d24814cd1f3f.jpeg",
				"image": "https://vkceyugu.cdn.bspapp.com/VKCEYUGU-4212d060-22ea-4808-b477-f5c9c9f2d4e2/f49b0ce3-78e7-46e4-aa3a-d24814cd1f3f.jpeg",
				"url": "https://promotion-waimai.meituan.com/invite/r2x/coupon/?inviteCode=NnOIp-QOs8SiYF1dcSlL5r8phPrCf6qkH7evMyjIoureqol0OXXaopfjjblE0yPg_mPiV52YY9OrHlpC2RKryAez4NpLK4WX3LpzY-umlMP8GT9LtxnpGC5G_nWkYfViSLBTNrGf-GT1TmD1t5cfJ2CWBghGmwfwBbMEUG9yyxA&lq_source=2",
				"appid": "wxde8ac0a21135c07d",
				"path": "/index/pages/h5/h5?weburl=https%3a%2f%2fpromotion-waimai.meituan.com%2finvite%2fr2x%2fcoupon%2f%3finviteCode%3dNnOIp-QOs8SiYF1dcSlL5r8phPrCf6qkH7evMyjIoureqol0OXXaopfjjblE0yPg_mPiV52YY9OrHlpC2RKryAez4NpLK4WX3LpzY-umlMP8GT9LtxnpGC5G_nWkYfViSLBTNrGf-GT1TmD1t5cfJ2CWBghGmwfwBbMEUG9yyxA%26lq_source%3d2"
			}, {
				"title": "美团商超生鲜红包",
				"description": "description",
				"sort": 5,
				"cate_id": 2,
				"logo": "https://img.yourtools.icu/images/projects/meituan.png",
				"image": "https://img.yourtools.icu/images/projects/meituan-shangchao.jpg",
				"url": "https://runion.meituan.com/url?key=7c2a1b12b058bb28b2ceaf6b22e4b89b&url=https%3A%2F%2Fi.meituan.com%2Fawp%2Fhfe%2Fblock%2F652c4b9d8a2425a98ca5%2F92207%2Findex.html%3Fappkey%3D7c2a1b12b058bb28b2ceaf6b22e4b89b%3Aonline20201108&sid=online20201108",
				"appid": "wxde8ac0a21135c07d",
				"path": "/index/pages/h5/h5?weburl=https%3A%2F%2Frunion.meituan.com%2Furl%3Fkey%3D7c2a1b12b058bb28b2ceaf6b22e4b89b%26url%3Dhttps%253A%252F%252Fi.meituan.com%252Fawp%252Fhfe%252Fblock%252F652c4b9d8a2425a98ca5%252F92207%252Findex.html%253Fappkey%253D7c2a1b12b058bb28b2ceaf6b22e4b89b%253Aonline20201108%26sid%3Donline20201108&lch=cps:waimai:5:7c2a1b12b058bb28b2ceaf6b22e4b89b:online20201108&f_token=1&f_userId=1"
			}, {
				"title": "美团吃喝玩乐",
				"tag": "巨划算",
				"description": "description",
				"sort": 6,
				"cate_id": 2,
				"logo": "https://img.yourtools.icu/images/projects/meituan.png",
				"image": "https://img.yourtools.icu/images/projects/meituan_chihewanle.jpg",
				"url": "https://act.meituan.com/clover/page/adunioncps/coupon_shop?utmSource=64181&utmMedium=DC751FF1558F04BDBD33396C4F74BD69&promotionId=20344&activity=0AlN4OtEIa",
				"appid": "wxde8ac0a21135c07d",
				"path": "/index/pages/h5/h5?weburl=https%3A%2F%2Fact.meituan.com%2Fclover%2Fpage%2Fadunioncps%2Fcoupon_shop%3FutmSource%3D64181%26utmMedium%3DDC751FF1558F04BDBD33396C4F74BD69%26promotionId%3D20344%26activity%3D0AlN4OtEIa"
			}, {
				"title": "饿了么大额满减券",
				"tag": "",
				"sort": 7,
				"logo": "https://img.yourtools.icu/images/projects/ele.png",
				"image": "https://img.yourtools.icu/images/projects/ele_guosu.jpg",
				"url": "https://s.click.ele.me/6mtdltu",
				"cate_id": 1,
				"appid": "wxece3a9a4c82f58c9",
				"path": "pages/sharePid/web/index?scene=https://s.click.ele.me%2F6mtdltu"
			}, {
				"title": "饿了么果蔬抢特价",
				"logo": "https://img.yourtools.icu/images/projects/ele.png",
				"image": "https://img.yourtools.icu/images/projects/eleme-cai.jpg",
				"url": "https://s.click.ele.me/CjMxotu",
				"cate_id": 1,
				"sort": 8,
				"appid": "wxece3a9a4c82f58c9",
				"path": "pages/sharePid/web/index?scene=https://s.click.ele.me%2FCjMxotu"
			}, {
				"title": "话费充值抵扣券",
				"tag": "",
				"logo": "https://img.yourtools.icu/images/projects/hf.jpg",
				"image": "https://img.yourtools.icu/images/projects/meituan_huafei.jpg",
				"appid": "wxde8ac0a21135c07d",
				"path": "dynamic-page/index?activityId=7&uid=136668568&yaoxin=1&mt_share_id=kjlmis2y6tg9&scene=fenxiao-third-assist",
				"url": "",
				"cate_id": 4,
				"sort": 9
			}, {
				"title": "携程超级会员",
				"tag": "超级会员",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_chaojihuiyuan.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "cwx/component/cwebview/cwebview?allianceId=1303224&data={\"needLogin\":true,\"isShareWebUrl\":true,\"url\":\"https%3A%2F%2Fcontents.ctrip.com%2Fbuildingblocksweb%2Fspecial%2Fmembershipcard%2Findex.html%3F%26allianceid%3D1303224%26sid%3D3939123%26ouid%3DH5B2Bonline%26sourceid%3D2055%26Popup%3Dclose%26openapp%3D3\"}&sid=3939123",
				"url": "https://t.ctrip.cn/HqNmAxa",
				"cate_id": 6,
				"sort": 10
			}, {
				"title": "携程火车票",
				"tag": "火车票",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_huoche.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/train/index/index?allianceId=1303224&sid=3939123",
				"url": "https://t.ctrip.cn/HqmRVRu",
				"cate_id": 6,
				"sort": 11
			}, {
				"title": "携程机票",
				"tag": "机票",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_jipiao.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/market/web/index?allianceId=1303224&from=https%3A%2F%2Fm.ctrip.com%2Fhtml5%2Fflight%2Fswift%2Findex%3F%26allianceid%3D1303224%26sid%3D3939123%26ouid%3DH5B2Bonline%26sourceid%3D2055%26Popup%3Dclose%26openapp%3D3&sid=3939123",
				"url": "https://t.ctrip.cn/HqNmAwY",
				"cate_id": 6,
				"sort": 12
			}, {
				"title": "携程租车·用车",
				"tag": "专车",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_zuyong.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/market/web/index?allianceId=1303224&from=https%3A%2F%2Fm.ctrip.com%2Fwebapp%2Fzhuanche%2Fairport-transfers%2Findex%3Fpopup%3Dclose%26autoawaken%3Dclose%3F%26allianceid%3D1303224%26sid%3D3939123%26ouid%3DH5B2Bonline%26sourceid%3D2055%26Popup%3Dclose%26openapp%3D3&sid=3939123",
				"url": "https://t.ctrip.cn/Hl6mGCf",
				"cate_id": 6,
				"sort": 13
			}, {
				"title": "携程酒店",
				"tag": "酒店",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_jiudian.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/market/web/index?allianceId=1303224&from=https%3A%2F%2Fm.ctrip.com%2Ftangram%2FMjczNQ%3D%3D%3FisHideNavBar%3DYES%26ctm_ref%3Dvactang_page_2735%26allianceId%3D1303224%26sid%3D3939123&sid=3939123",
				"url": "https://t.ctrip.cn/HpC7rjA",
				"cate_id": 6,
				"sort": 14
			}, {
				"title": "携程跟团游",
				"tag": "跟团游",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_gentuan.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/market/web/index?allianceId=1303224&from=https%3A%2F%2Fm.ctrip.com%2Ftangram%2FMTE0NA%3D%3D%3Fctm_ref%3Dvactang_page_1144%26isHideNavBar%3DYES%26allianceId%3D1303224%26sid%3D3939123&sid=3939123",
				"url": "https://t.ctrip.cn/HnR7ttv",
				"cate_id": 6,
				"sort": 15
			}, {
				"title": "携程汽车票",
				"tag": "汽车票",
				"logo": "https://img.yourtools.icu/images/projects/xc.png",
				"image": "https://img.yourtools.icu/images/projects/xc_qiche.jpg",
				"appid": "wx0e6ed4f51db9d078",
				"path": "pages/bus/index/index?allianceId=1303224&sid=3939123",
				"url": "https://t.ctrip.cn/HpC7rj9",
				"cate_id": 6,
				"sort": 16
			}, {
				"title": "橙心优选",
				"logo": "https://img.yourtools.icu/images/projects/cxyx.png",
				"image": "https://img.yourtools.icu/images/projects/chengxinyouxuan.png",
				"appid": "wxd7fa7df243b05aed",
				"path": "cx-cpc/views/index/index?share_source_id=60052&biz_channel_id=666005&origin=&root_xpsid=5ea657c59b914adfafd319c22a1eda3d&xpsid=5ea657c59b914adfafd319c22a1eda3d&f_xpsid=5ea657c59b914adfafd319c22a1eda3d&page=invitee&share_code=bvdp01ovjt2j4egv196000&dchn=nLAEd3",
				"url": "",
				"cate_id": 8,
				"sort": 17
			}, {
				"title": "滴滴出行20元红包",
				"logo": "https://img.yourtools.icu/images/projects/didi.jpg",
				"image": "https://img.yourtools.icu/images/projects/didichuxing.jpg",
				"appid": "wxaf35009675aa0b2a",
				"path": "passenger-recommend/views/coupon/index?template=1&sharecode=bv0hh8rldjktihfbkuvg&root_dchn=RpQlOo&channel_id=1100000090&scene=14",
				"url": "",
				"cate_id": 7,
				"sort": 18
			}, {
				"title": "京东自购省分享赚",
				"tag": "东小店",
				"logo": "https://img.yourtools.icu/images/projects/jd.png",
				"image": "https://img.yourtools.icu/images/projects/dongxiaodian.jpg",
				"appid": "wx9f8396eb61de4188",
				"path": "pages/memberhome/memberhome?scene=bsysot",
				"url": "",
				"cate_id": 5,
				"sort": 19
			}, {
				"title": "花小猪打车",
				"logo": "https://img.yourtools.icu/images/projects/hxz.png",
				"image": "https://img.yourtools.icu/images/projects/huaxiaozhu.jpg",
				"appid": "wxd98a20e429ce834b",
				"path": "kfpub/pages/gift?jump_home=1&f_dpsid=5333eb668a594158974ec22606b82fd2&latitude=22.772851019965277&g_channel=2f9e032794de100a0b8eb5a203bd2a37&entrance_channel=&channel=2001001001&xpsid=1ef256fe8c9f4e5bb155fe69056d6bc2&share_code=bv0g6k6tjqf1nlgplslg&dchn=zxOgqk&channel_id=2001001001&longitude=108.26958441840277&city_id=33",
				"url": "",
				"cate_id": 9,
				"sort": 20
			}]
		};
	},
	onLoad(e) {
		//#ifdef H5
		let tabId = this.$route.query.tabId ? parseInt(this.$route.query.tabId) : 0
		//#endif
		//#ifdef MP-WEIXIN
		let tabId = e.tabId ? parseInt(e.tabId) : 0
		//#endif
		for(let i in this.tabs){
			if(tabId == this.tabs[i].tabId){
				this.current = parseInt(i)
			}
		}
		this.changeTab(this.current)
		//#ifdef MP
		wx.showShareMenu({
		  withShareTicket: true,
		  menus: ['shareAppMessage', 'shareTimeline']
		})
		//#endif
		
	},
	onShareAppMessage(res) {
		return {
			title: '这里有好多美团饿了么优惠券，天天可领哦~~',
			path: '/pages/discount/index?invitation='+this.$store.state.userInfo._id,
			imageUrl: this.shareImage
		}
	},
	onShareTimeline(res) {
		return {
			title: '这里有好多美团饿了么优惠券，快来领券吧~~',
			path: '/pages/discount/index?invitation='+this.$store.state.userInfo._id,
			imageUrl: this.shareImage
		}
	},
	methods: {
		changeTab(index) {
			console.log('当前选中的项：' + index);
			this.couponList = []
			uni.showLoading({
			    title: '获取优惠中'
			});
			let projects = index==0?this.allProjects:this.allProjects.filter(ele => ele.cate_id==index)
			let newProjects = []
			//#ifdef MP-WEIXIN
			for (let item in projects) {
				if (projects[item].path) {
					newProjects.push(projects[item])
				}
			}
			//#endif
			//#ifdef H5
			for (let item in projects) {
				if (projects[item].url) {
					newProjects.push(projects[item])
				}
			}
			//#endif
			this.projectList =  newProjects

			// if(index == 0){
			// 	this.couponList = this.coupons
			// }else{
			// 	for(let i in this.coupons){
			// 		if(this.coupons[i].tabId == this.tabs[index].tabId){
			// 			this.couponList.push(this.coupons[i])
			// 		}
			// 	}
			// }
			//#ifdef H5
			this.$nextTick(() => {
				this.$refs.coupon.scrollTop= 0;
			})
			//#endif
			setTimeout(() => {
				uni.hideLoading()
			}, 500)
		},
		toProject(i){
			console.log(this.projectList[i])
			//h5
			//#ifdef H5
			window.location.href = this.projectList[i].url
			//#endif
			//微信小程序
			//#ifdef MP-WEIXIN 
			
			wx.navigateToMiniProgram({
			  appId: this.projectList[i].appid, 
			  path: this.projectList[i].path,
			  success(res) {
				// 打开成功
			  }
			})
			//#endif
		}
	}
};
</script>

<style lang="scss">
page {
	background-color: #f8f8f8;
}
.container {
	font-size: 14px;
	line-height: 24px;
	position: relative;
	.tab {
		position: fixed;
		top: var(--window-top);
		left: 0;
		z-index: 9999;
	}
	.coupon {
		padding-top: 200rpx;
		.item {
			background-color: #ffffff;
			margin: 30rpx;
			border-radius: 10rpx;
			padding: 0 30rpx 30rpx 30rpx;
			.top {
				height: 116rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				.left {
					height: 116rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					.content {
						width: 100%;
					}
					.icon {
						display: inline-block;
						vertical-align: bottom;
						width: 52rpx;
						height: auto;
					}
					.name {
						text-align: left;
						display: inline-block;
						vertical-align: bottom;
						font-size: 34rpx;
						color: #000;
						line-height: 50rpx;
						font-weight: bold;
						margin-left: 15rpx;
					}
					.text {
						width: 150rpx;
						height: 38rpx;
						line-height: 38rpx;
						text-align: center;
						font-size: 24rpx;
						color: #61300e;
						background: linear-gradient(90deg, #f9db8d, #f8d98a);
						border-radius: 6rpx;
					}
				}

				.right {
					width: 170rpx;
					height: 60rpx;
					border-radius: 30rpx;
					background: linear-gradient(90deg, #ec6f43, #ea4a36);
					color: #fff;
					font-size: 28rpx;
					line-height: 60rpx;
					text-align: center;
				}
			}

			.bottom {
				height: auto;
				width: 100%;
				image {
					display: block;
					width: 100%;
					height: auto;
				}
			}
		}
	}
}
</style>
